Skip to content
This repository has been archived by the owner on Sep 4, 2024. It is now read-only.

Added support for add/remove of custom placeholders, inline RegExp array masks, and functions as masks #467

Closed

Conversation

davismcphee
Copy link

This PR resolves #128 by providing support for add/remove of global mask placeholders, inline RegExp array masks, and passing functions as masks. Also added tests for all test cases listed in the issue.

@rafaelmaiach
Copy link

rafaelmaiach commented Feb 15, 2020

Will this PR be merged?
I'm needing the v-mask accepting array on a project and it would fit perfectly!

Btw, I tried to install the package using a reference to your commit, but it didn't work. Will it possible to do something like:
<input v-mask="['NNN-NNN', 'NNN-NNNN']"> for example ?

@davismcphee
Copy link
Author

davismcphee commented Feb 16, 2020

The inline array mask accepts an array of RegExp and strings that make up a single mask. It won't allow you to define multiple masks for the same input. For example:

<input v-mask="[/\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/]"> // '123456' => '123-456'

You could use a mask function to choose one of multiple masks though:

Vue.component('my-masked-input', {
  data() { 
    return { value: '123456' } ;
  },
  template: '<input v-mask="maskFn" v-model="value" />',
  methods: {
    maskFn(value) {
      if (someCondition) {
        return [/\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/]; // '123456' => '123-456'
      } else {
        return [/\d/, /\d/, '-', /\d/, /\d/, '-', /\d/, /\d/]; // '123456' => '12-34-56'
      }
    }
  }
});

@cendrizzi
Copy link

This seems really nice. Would love to see this merged.

@probil
Copy link
Owner

probil commented May 24, 2020

Wow! @davismcphee
This is awesome. I highly appreciate your effort.

I didn't have time to maintain the library actively for the last 6 months and it turned out there are a lot of nice stuff. I'll pull your PR and run all the check locally. There are also a couple of places not covered by tests. But besides from that MR looks really good!

@probil
Copy link
Owner

probil commented May 24, 2020

Merged in #479.
Thanks again @davismcphee

@probil probil closed this May 24, 2020
@davismcphee
Copy link
Author

@probil I'm happy to help. Thanks for the great library!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Ability to define mask placeholders
4 participants